<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>留言板用户信息更改</title>
    <link rel="stylesheet" href="/stylesheets/css/index.css" >
  </head>
  <body>
    <div class="container">
      <%- include('he_nav') -%>

      <div class="reg_box">
          <form  action="/users/changeReg" method="post">
            <p>请输入用户名称：</p>
            <input type="text" name="loginname" value="">
            <div style="color:red" data-error="loginname"></div>
            <p>请输入更改的密码：</p>
            <input type="password" name="password" value="">
            <div style="color:red" data-error="password"></div>
            <p>请再次输入更改的密码：</p>
            <input type="password" name="confirm" value="">
            <div style="color:red" data-error="confirm"></div>
            <p>请选择是否参与管理：</p>
            <input class="radio" type="radio" name="admin" value="true">成为管理员
            <input class="radio" type="radio" name="admin" value="false" checked="checked">不成为管理员
            <p>请输入验证码：</p>
            <%= firstnum %> + <%= secondnum %> = <input type="text" class="verif" name="vnum" >
            <button type="submit" name="button" >确认</button>
            <div style="color:red" data-error="vnum"></div>
          </form>
      </div>

      <footer>
        <p>使用条款和隐私条款。版权所有，保留一切权利。</p>
      </footer>
    </div>

    <script type="text/javascript" src="../../../javascripts/open.js"></script>
    <script type="text/javascript" src="../../../javascripts/validate.js"></script>
    <script type="text/javascript">
      const form = document.querySelector("form");
      const doms = form.querySelectorAll("div");
      const loginnameerror = doms[0];
      const passworderror = doms[1];
      const confirmerror = doms[2];
      const vnumerror = doms[3];
      const firstnum = <%= firstnum %>;
      const secondnum = <%= secondnum %>;

      form.onsubmit = async function (event) {
        event.preventDefault();
        const inputs = form.querySelectorAll("input");
        const loginname = inputs[0].value;
        const password = inputs[1].value;
        const confirm = inputs[2].value;
        for(var i = 3; i < 5; i++){
          console.log(inputs[i]);
          if(inputs[i].checked == true){
            var admin = inputs[i].value;
            console.log("admin=",admin);
            break;
          }
        }
        const vnum = inputs[5].value;
        const errors = validate(loginname,password,confirm,vnum,firstnum,secondnum);
        if(errors){
          showInfo(JSON.stringify(errors));
        }else{
          await fetch("/users/changeReg",{
            method:"POST",
            body: JSON.stringify({loginname,password,admin,confirm,vnum}),
            credentials:"include",
            headers:{
              "Content-Type":"application/json"
            }
          }).then(res=>res.text())
            .then(errors=>alert(errors))
            .catch(e => console.log("error", e));
          location.href="/";
        }
      }
    </script>
  </body>
</html>
